<template>
	<view class="page_cont">
		<view class='top_bg_box'>
			<view class='top_bg' :class="statusBarHeight>20?'top_bg_wrap':''"></view>
		</view>
		<image class='bg' :style="{paddingTop:statusBarHeight>20?'24px':'0'}" src="https://ossdev0.jiabala.com/wJRa33ZYFfr5Q"></image>
		<view class='user_wrap'>
			<view class='user_box' :style="{paddingTop:statusBarHeight>20?'24px':'0'}">
				<image class='avatar' :src="userInfo.avatar || userInfo.businessLogo || '/static/icon27.png'" mode="aspectFill"></image>
				<view class='user_desc' v-if="show_page==1">
						<view class='name_wrap' @click="nav_user_dom()">
							<!-- <view class='text'>{{userInfo.nickName}}</view> -->
							<scroll-view class='text indesscroll' scroll-x="true" scroll-with-animation="true">{{userInfo.nickName}}</scroll-view>
							<image class='icon' src="/static/icon32.png"></image>
						</view>
					<view class='resume' @click='nav_user_resume()'>
						<image class='icon' src="/static/icon33.png"></image>
						<view class='text'>我的简历</view>
					</view>
				</view>
				<view class='user_desc' v-if="show_page==2">
					<view class='mech_name'>
						<scroll-view class='scroll' scroll-x="true" scroll-with-animation="true">{{userInfo.businessName}}</scroll-view>
					</view>
					<view class='mech_id'>ID：{{show_page===1?userInfo.id:userInfo.businessId}}</view>
				</view>
			</view>
		</view>
		<view class='top_funct' :class="show_page==2?'top_mech_func':''">
			<!-- <view class='vip_wrap' v-if="show_page==2">
				<view class='no_level' @click="nav_level()" v-if="!level">
					<view class='text'>开通直聘VIP 尊享更多权益</view><view class='btn'>立即开通</view>
				</view>
				<view class='level'  @click="nav_level()" v-else>
					<view class='level_name'>白金会员</view>
					<image class='icon' src="/static/icon61.png"></image>
					<view class='num'>360天</view>
				</view>
			</view> -->
			<view class='fun_wrap' v-if="show_page==1">
				<view class='item' v-for="(item,index) in user_top_funs" :key="index" @click="nav_top_funct(index)">
					<image class='icon' :src="item.url"></image>
					<view class='text'>{{item.title}}</view>
					<view class='num' v-if="item.num&&item.num>0">{{item.num}}</view>
				</view>
			</view>
			<view class='fun_wrap mech_fun_wrap' v-if="show_page==2">
				<view class='item' v-for="(item,index) in mech_top_funs" :key="index" @click="nav_top_funct(index)">
					<image class='icon' :src="item.url"></image>
					<view class='text'>{{item.title}}</view>
					<view class='num' v-if="item.num&&item.num>0">{{item.num}}</view>
				</view>
			</view>
		</view>
		<view class='page_funct'>
			<scroll-view class='scroll' scroll-y="true" scroll-with-animation="true" v-if="show_page==1">
				<view class='item' v-for="(item,index) in teach_page_funs" :key="index" @click="teach_page_funct(index)">
					<image class='img' :src="item.url"></image>
					<view class="title">{{item.title}}</view>
					<scroll-view class='text indesscroll' scroll-x="true" scroll-with-animation="true" v-if="item.text">{{item.text}}</scroll-view>
					<image class='icon' src="/static/icon43.png"></image>
				</view>
			</scroll-view>
			<scroll-view class='scroll scroll_mech' scroll-y="true" scroll-with-animation="true" v-if="show_page==2">
				<view class='item' v-for="(item,index) in unit_page_funs" :key="index" @click="unit_page_funct(index)" v-if='index!=2'>
					<image class='img' :src="item.url"></image>
					<view class="title">{{item.title}}</view>
					<scroll-view class='text indesscroll' scroll-x="true" scroll-with-animation="true" v-if="item.text">{{item.text}}</scroll-view>
					<image class='icon' src="/static/icon43.png"></image>
				</view>
			</scroll-view>
		</view>
		<pickerPop :showMask="show_mask" :showIndex="1" :title="title" :pickers="pickers" :value="value" @closeMask="close_mask"
		 @pickerChange="picker_change" @confirmValue="confirm_value"></pickerPop>
		 <view class="mask" style="background: rgba(0,0,0,0);" @click="nav_login()" v-if="!login"></view>
	</view>
</template>

<script>
	import PickerPop from "../../components/pickerPop.vue"
	import resume from "../../api/myResume.js"
	import config from "../../api/config.js"
	export default {
		data() {
			return {
				statusBarHeight: '',
				user_top_funs: [{
						url: '/static/icon34.png',
						page: '/mypage/sponsorBy/sponsorBy',
						title: '我的发起',
					},
					{
						url: '/static/icon35.png',
						page: '/mypage/receive/receive',
						title: '对方接收',
					},
					{
						url: '/static/icon36.png',
						page: '/mypage/unitInvit/unitInvit',
						title: '单位邀请',
						num: 0
					}
				],
				mech_top_funs: [{
						url: '/static/icon34.png',
						page: '/mypage/sponsorBy/sponsorBy',
						title: '我的邀请'
					},
					{
						url: '/static/icon35.png',
						page: '/mypage/receive/receive',
						title: '对方接收'
					},
					{
						url: '/static/icon36.png',
						page: '/mypage/unitInvit/unitInvit',
						title: '老师投递',
						num: 0,
					},
					{
						url: '/static/icon72.png',
						page: '/mypage/servicePush/servicePush',
						title: '服务推送',
						num: 0,
					}
				],
				teach_page_funs: [{
						url: '/static/icon37.png',
						page: '/mypage/myColl/myColl',
						title: '我的收藏',
						text: ''
					},
					{
						url: '/static/icon38.png',
						page: '/mypage/hideSetting/hideSetting',
						title: '隐私设置',
						text: '公开',
						checked: true
					},
					{
						url: '/static/icon39.png',
						page: '',
						title: '切换身份',
						text: '老师'
					},
					{
						url: '/static/icon40.png',
						page: '/mypage/feedback/feedback',
						title: '用户反馈',
						text: ''
					},
					{
						url: '/static/icon41.png',
						page: '/mypage/about/about',
						title: '关于家巴啦',
						text: ''
					},
					{
						url: '/static/icon42.png',
						page: '/mypage/setting/setting',
						title: '设置',
						text: ''
					}
				],
				unit_page_funs: [{
						url: '/static/icon50.png',
						page: '/mypage/jobMent/jobMent',
						title: '职位管理',
						text: '发布职位'
					},
					{
						url: '/static/icon37.png',
						page: '/mypage/myColl/myColl',
						title: '我的收藏',
						text: ''
					},
					{
						url: '/static/icon51.png',
						page: '/mypage/unitAttr/unitAttr',
						title: '单位属性',
						text: ''
					},
					{
						url: '/static/icon39.png',
						page: '',
						title: '切换身份',
						text: '单位'
					},
					{
						url: '/static/icon40.png',
						page: '/mypage/feedback/feedback',
						title: '用户反馈',
						text: ''
					},
					{
						url: '/static/icon41.png',
						page: '/mypage/about/about',
						title: '关于家巴啦',
						text: ''
					},
					{
						url: '/static/icon42.png',
						page: '/mypage/setting/setting',
						title: '设置',
						text: ''
					}
				],
				show_mask: false,
				title: '',
				pickers:[],
				value: [0],
				show_page: 1,
				id: '',
				userInfo: {},
				login: false,
				switchOpen:true,
				level: false,
				screening: false
			}
		},
		onLoad() {
			var that = this;
			var sysinfo = wx.getSystemInfoSync(),
				statusBarHeight = sysinfo.statusBarHeight;
			that.statusBarHeight = statusBarHeight;
		},
		onShow() {
			var that=this;
			uni.getStorage({
				key: "token",
				success() {
					const userinfo = uni.getStorageSync('userinfo')
					that.id=userinfo.id
					const showPageNum = uni.getStorageSync('identityNum')
					if(showPageNum){
						that.getResumeInfo()
						that.show_page = showPageNum?showPageNum:1
						that.login=true;
						that.get_myCount();
					}else{
						uni.removeStorageSync('unionId')
						uni.removeStorageSync('userinfo')
						uni.removeStorageSync('token')
						uni.removeStorageSync('login_info')
					}
				},
				fail(){
					that.login=false
					that.userInfo= {}
					that.user_top_funs[2].num=0;
				}
			})
		},
		watch:{
			show_page(val){
				config.isFirstLogin().then(res=>{
					val===1?this.userInfo=res.data.data.accountProfile:this.userInfo=res.data.data.accountBusinesses
				})
				// 修改tabbar
				if(val==1){
					uni.setTabBarItem({
					  index: 0,
					  text: '职位',
					  iconPath: '/static/tab1.png',
					  selectedIconPath: '/static/tab2.png'
					})
				}else{
					uni.setTabBarItem({
					  index: 0,
					  text: '老师',
					  iconPath: '/static/tab5.png',
					  selectedIconPath: '/static/tab6.png'
					})
				}
			}
		},
		methods: {
			getResumeInfo() {
				config.isFirstLogin().then(res=>{
					if(this.show_page===1){
						this.userInfo=res.data.data.accountProfile
						// console.log(this.userInfo.nickName);
						this.teach_page_funs[1].text=res.data.data.accountProfile.isPublic?'公开':'保密'
						this.teach_page_funs[1].checked=res.data.data.accountProfile.isPublic
						this.teach_page_funs[1].id=res.data.data.accountProfile.id
					}else{
						this.userInfo=res.data.data.accountBusinesses
						uni.setStorageSync("userIdentity",res.data.data.accountBusinesses)
					}
					if(res.data.data.accountProfile!==null && res.data.data.accountBusinesses!==null){
						this.pickers=[{name: `老师`}, {name: `${res.data.data.accountBusinesses.businessName}`}]
						this.teach_page_funs[2]['text']=res.data.data.accountProfile.nickName
						this.unit_page_funs[3]['text']=res.data.data.accountBusinesses.businessName
					}else if(res.data.data.accountProfile!==null && this.show_page===1){
						this.pickers=[{name: `${res.data.data.accountProfile.nickName}`}, {name: `单位`}]
						this.teach_page_funs[2]['text']=res.data.data.accountProfile.nickName
					}else if(res.data.data.accountBusinesses!==null && this.show_page===2){
						this.pickers=[{name: `老师`}, {name: `${res.data.data.accountBusinesses.businessName}`}]
						this.unit_page_funs[3]['text']=res.data.data.accountBusinesses.businessName
					}
				})
			},
			nav_login(){
				uni.navigateTo({
					url: "../login/login"
				})
			},
			// 修改个人资料
			nav_user_dom() {
				uni.navigateTo({
					url: `../../mypage/myDom/myDom?id=${this.id}`
				})
			},
			// 我的简历
			nav_user_resume() {
				wx.navigateTo({
					url: '../../mypage/resume/resume'
				})
			},
			// vip
			nav_level(){
				uni.navigateTo({
					url: "../../mypage/member/member"
				})
			},
			//顶部模块
			nav_top_funct(index) {
				if(this.show_page==1){
					uni.navigateTo({
						url: this.user_top_funs[index].page + '?type=' + this.show_page
					})
				}else{
					uni.navigateTo({
						url: this.mech_top_funs[index].page + '?type=' + this.show_page+'&id='+this.userInfo.businessId
					})
				}
			},
			// 页面模块(老师)
			teach_page_funct(index) {
				if (index == 2) {
					this.show_mask = true;
					this.title = "切换身份";
					uni.hideTabBar({
						animation: true
					})
				} else {
					if (index == 1) {
						uni.navigateTo({
							url: this.teach_page_funs[1].page + '?type=1' + '&checked=' + this.teach_page_funs[1].checked + '&id=' +this.teach_page_funs[1].id
						})
					} else {
						uni.navigateTo({
							url: this.teach_page_funs[index].page + '?type=1'
						})
					}
				}
			},
			// 页面模块(单位)
			unit_page_funct(index) {
				if (index == 3) {
					this.show_mask = true;
					this.title = "切换身份";
					uni.hideTabBar({
						animation: true
					})
				} else {
					if(index==0||index==2){
						uni.navigateTo({
							url: this.unit_page_funs[index].page + '?type=2' + '&id='+this.userInfo.businessId
						})
					}else{
						uni.navigateTo({
							url: this.unit_page_funs[index].page + '?type=2'
						})
					}
				}
			},
			// 关闭选择框
			close_mask() {
				this.show_mask = false;
				uni.showTabBar({
					animation: true
				})
			},
			// 选择
			picker_change(res) {
				// console.log(res)
				this.value = res;
			},
			// 确认
			confirm_value() {
				config.isFirstLogin().then(res => {
					this.close_mask();
					// console.log(res.data.data.accountProfile);
					if(this.value[0]===0){
						if(res.data.data.accountProfile){
							this.show_page=1
							uni.setStorageSync('identityNum', 1)
							this.close_mask()
							this.saveLoginStatus(res.data.data.accountProfile.id,2)
						}else{
							uni.navigateTo({
								url:'../../mypage/myDom/myDom'
							})
						}
					}else{
						if(res.data.data.accountBusinesses==null){
							//
							this.get_org_list()
						}else{
							this.show_page=2
							uni.setStorageSync('identityNum', 2)
							uni.setStorageSync("userIdentity",res.data.data.accountBusinesses)
							this.close_mask()
							this.saveLoginStatus(res.data.data.accountBusinesses.id,1)
						}
					}
				})
			},
			// 记录下次状态
			saveLoginStatus(id,identity){
				resume.save_login_identity({id:id,identity:identity}).then(res=>{
					// console.log(res);
				})
			},
			// 是否有认证机构
			get_org_list(){
				var params={
					"phone": uni.getStorageSync("userinfo").phone
				}
				config.get_org_list(params).then(res=>{
					var list=res.data.data;
					if(list&&list.length>0){
						var len=list.length;
						if(list[len-1].status==1){
							// 审核
							uni.navigateTo({
								url: '/pages/mechVerify/mechVerify?type=3&status=1'
							})
						}else if(list[len-1].status==2){
							// 审核通过
							uni.navigateTo({
								url: '/pages/mechVerify/mechVerify?type=2&status=1'+'&id='+list[len-1].businessId
							})
						}else if(list[len-1].status==4){
							// 审核未通过
							uni.navigateTo({
								url: '/pages/mechVerify/mechVerify?type=1&status=1'+'&id='+list[len-1].businessId
							})
						}
					}else{
						uni.navigateTo({
							url:'../bindUnit/bindUnit'
						})
					}
				})
			},
			// 消息数量
			get_myCount(){
				resume.get_myCount().then(res=>{
					var info=res.data.data;
					this.user_top_funs[2].num=info.businessInvitation;
					this.mech_top_funs[2].num=info.teacherInvitation;
					this.mech_top_funs[3].num=info.serviceRecommendNum;
				})
			},
		},
		components: {
			pickerPop: PickerPop
		}
	}
</script>

<style lang="scss">
	page {
		background: #F7F9FB;

		.page_cont {
			width: 100%;
			position: relative;

			.top_bg_box {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				z-index: 1;

				.top_bg {
					width: 100%;
					height: 440rpx;
					position: relative;
					overflow: hidden;
					z-index: 100;

					&::after {
						display: block;
						content: ' ';
						width: 120%;
						height: 440rpx;
						position: absolute;
						left: -10%;
						top: 0;
						z-index: -1;
						border-radius: 0 0 50% 50%;
						background: linear-gradient(180deg, #5BADFF 0%, #5B90FF 100%);
					}
				}

				.top_bg_wrap {
					padding-top: 24px;

					&::after {
						padding-top: 24px;
					}
				}
			}

			.bg {
				position: absolute;
				top: 154rpx;
				right: 62rpx;
				width: 257rpx;
				height: 236rpx;
				z-index: 2;
				padding-top: 24px;
			}

			.user_wrap {
				position: relative;
				z-index: 100;
				padding: 142rpx 48rpx 0 48rpx;
				.user_box{
					width: 100%;
					display: flex;
					flex-direction: row;

					.avatar {
						width: 116rpx;
						height: 116rpx;
						border-radius: 50%;
						margin-right: 24rpx;
					}

					.user_desc {
						flex: 1;
						padding-top: 14rpx;
						width: 0;
						
						.name_wrap{
							display: flex;
							flex-direction: row;
							align-items: center;
							margin-bottom: 6rpx;
							.indesscroll{
								overflow: hidden;
								white-space:nowrap;
							}							
							.text {
								/* #ifdef H5 || MP-WEIXIN */
								max-width: 250rpx;
								/* #endif */
								/* #ifdef APP-PLUS */
								max-width: 240rpx;
								/* #endif */
								width: auto;
								height: 50rpx;
								font-size: 36rpx;
								font-weight: 600;
								line-height: 50rpx;
								color: #FFFFFF;
								overflow: hidden;
								margin-right: 16rpx;
							}

							.icon {
								width: 50rpx;
								height: 50rpx;
							}
						}

						.resume {
							display: flex;
							flex-direction: row;
							align-items: center;

							.icon {
								width: 34rpx;
								height: 34rpx;
							}

							.text {
								height: 34rpx;
								font-size: 24rpx;
								font-weight: 400;
								line-height: 34rpx;
								color: #FFFFFF;
							}
						}

						.mech_name {
							overflow: hidden;
							height: 50rpx;
							margin-bottom: 6rpx;
							.scroll{
								overflow: hidden;
								white-space: nowrap;
								width: auto;
								height: 64rpx;
								font-size: 36rpx;
								font-weight: 600;
								line-height: 50rpx;
								color: #FFFFFF;
							}
						}

						.mech_id {
							display: inline-block;
							padding: 0 20rpx;
							height: 42rpx;
							background: #4485F2;
							border-radius: 22rpx;
							text-align: center;
							font-size: 22rpx;
							font-weight: 400;
							line-height: 42rpx;
							color: rgba(255,255,255,0.9);
						}
					}
				}
			}

			.top_funct {
				position: relative;
				z-index: 200;
				margin: 52rpx 32rpx 32rpx 32rpx;
				.vip_wrap{
					width: 100%;
					height: 132rpx;
					box-sizing: border-box;
					background: url('https://ossdev0.jiabala.com/FJJfCdkZdkhAA')no-repeat 0 0/100% 100%;
					.no_level{
						padding: 26rpx 34rpx 0 86rpx;
						display: flex;
						flex-direction: row;
						align-items: center;
						.text{
							flex: 1;
							height: 40rpx;
							font-size: 28rpx;
							font-weight: 400;
							line-height: 40rpx;
							color: #CE994F;
							margin-right: 16rpx;
						}
						.btn{
							width: 162rpx;
							height: 54rpx;
							text-align: center;
							line-height: 54rpx;
							background: linear-gradient(148deg, #FFD9A2 0%, #F1B965 100%);
							border-radius: 8rpx;
							font-size: 24rpx;
							font-weight: 600;
							color: #754E19;
							letter-spacing: 8rpx;
						}
					}
					.level{
						padding: 32rpx 64rpx 0 88rpx;
						display: flex;
						flex-direction: row;
						align-items: center;
						.level_name{
							height: 42rpx;
							font-size: 30rpx;
							font-weight: 400;
							line-height: 42rpx;
							color: #CE994F;
							margin-right: 6rpx;
						}
						.icon{
							width: 28rpx;
							height: 28rpx;
						}
						.num{
							flex: 1;
							text-align: right;
							height: 50rpx;
							font-size: 36rpx;
							font-weight: 600;
							line-height: 50rpx;
							color: #754E19;
						}
					}
				}
				.fun_wrap{
					padding: 28rpx 74rpx 24rpx 74rpx;
					background: #fff;
					border-radius: 16rpx;
					display: flex;
					flex-direction: row;
					.item {
						flex: 1;
						margin-right: 88rpx;
						position: relative;
						text-align: center;
						&:last-child {
							margin-right: 0;
						}
						.icon {
							width: 112rpx;
							height: 98rpx;
						}
						.text {
							text-align: center;
							height: 42rpx;
							font-size: 30rpx;
							font-weight: 400;
							line-height: 42rpx;
							color: #3F4A58;
							transform: translateY(-6rpx);
						}
						.num{
							position: absolute;
							top: -10rpx;
							right: 10rpx;
							padding: 2rpx 10rpx;
							border-radius: 20rpx;
							background: #FF6951;
							color: #fff;
							font-size: 20rpx;
							font-weight: 400;
							border: 4rpx solid #fff;
						}
					}
				}
				.mech_fun_wrap{
					padding: 28rpx 32rpx 24rpx 32rpx;
					.item{
						margin-right: 36rpx;
					}
				}
			}
			// .top_mech_func{
			// 	// margin: 52rpx 32rpx 32rpx 32rpx;
			// 	margin: 40rpx 32rpx 24rpx 32rpx;
			// 	.fun_wrap{
			// 		transform: translateY(-26rpx);
			// 	}
			// }

			.page_funct {
				margin: 0 32rpx;
				background: #fff;
				border-radius: 16rpx;
				.indesscroll{
					width: 50%;
					overflow: hidden;
					white-space:nowrap;
					text-align: right;
				}
				.scroll{
					width: 100%;
					.item{
						display: flex;
						flex-direction: row;
						align-items: center;
						padding: 32rpx;
						border-bottom: 2rpx solid #F7F9FB;

						&:last-child {
							border-bottom: 0;
						}

						.img {
							width: 33rpx;
							height: 32rpx;
							margin-right: 24rpx;
						}

						.title {
							flex: 1;
							height: 40rpx;
							font-size: 28rpx;
							font-weight: 400;
							line-height: 40rpx;
							color: #3F4A58;
							margin-right: 12rpx;
						}

						.text {
							height: 40rpx;
							font-size: 28rpx;
							font-weight: 400;
							line-height: 40rpx;
							color: rgba(121, 133, 148, 0.5);
						}

						.icon {
							width: 24rpx;
							height: 24rpx;
							margin-left: 12rpx;
						}
					}
				}
				// .scroll_mech{
				// 	height: 46vh;
				// }
			}
		}
	}
</style>
